Ajax ব্যবহার করে Server Side Validation এবং Error Handling করতে হলে, Ajax রিকোয়েস্টের মাধ্যমে সার্ভারে ফর্ম ডেটা পাঠানো হয় এবং PHP স্ক্রিপ্টে সেই ডেটা ভ্যালিডেট করা হয়। সার্ভার সাইডে ত্রুটি থাকলে তা Ajax রেসপন্স হিসেবে ফেরত পাঠানো হয় এবং ব্রাউজারের কনসোলে বা UI-তে উপযুক্ত মেসেজ দেখানো হয়। এই প্রক্রিয়ায়, ব্যবহারকারীর ইনপুট ডেটা নিরাপদে যাচাই করা যায় এবং সম্ভাব্য ত্রুটি এড়ানো যায়।
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ajax Server Side Validation Example</title>
</head>
<body>
<h1>Employee Registration Form</h1>
<form id="employeeForm">
<label for="name">Name:</label>
<input type="text" id="name" name="name" required>
<br><br>
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
<br><br>
<label for="department">Department:</label>
<input type="text" id="department" name="department" required>
<br><br>
<button type="button" onclick="submitEmployeeForm()">Submit</button>
</form>
<div id="response-container">
<!-- রেসপন্স বা ত্রুটি মেসেজ এখানে দেখানো হবে -->
</div>
<script>
function submitEmployeeForm() {
// ফর্ম ডেটা সংগ্রহ করা
var form = document.getElementById('employeeForm');
var formData = new FormData(form);
// XMLHttpRequest অবজেক্ট তৈরি করা
var xhr = new XMLHttpRequest();
// POST রিকোয়েস্ট ওপেন করা
xhr.open("POST", "server_side_validation.php", true);
// রেসপন্স হ্যান্ডলিং সেট করা
xhr.onreadystatechange = function() {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
document.getElementById("response-container").innerHTML = xhr.responseText;
} else {
// ত্রুটি হ্যান্ডলিং: HTTP ত্রুটি
document.getElementById("response-container").innerHTML = "Error: Could not submit the form.";
}
}
};
// ত্রুটি হ্যান্ডলিংয়ের জন্য onerror ইভেন্ট হ্যান্ডলার সেট করা
xhr.onerror = function() {
document.getElementById("response-container").innerHTML = "Network Error: Please check your connection.";
};
// রিকোয়েস্ট পাঠানো
xhr.send(formData);
}
</script>
</body>
</html>
বিস্তারিত ব্যাখ্যা:
<form>
) তৈরি করা হয়েছে, যেখানে নাম, ইমেইল, এবং ডিপার্টমেন্ট ইনপুট ফিল্ড রয়েছে।submitEmployeeForm()
ফাংশন কল হবে, যা Ajax এর মাধ্যমে ফর্ম ডেটা সার্ভারে পাঠাবে এবং রেসপন্স হ্যান্ডল করবে।response-container
নামে একটি <div>
এলিমেন্ট রয়েছে, যেখানে PHP স্ক্রিপ্ট থেকে প্রাপ্ত রেসপন্স বা ত্রুটি মেসেজ দেখানো হবে।<?php
// ফর্ম থেকে ডেটা সংগ্রহ করা এবং পরিষ্কার করা
$name = trim($_POST['name']);
$email = trim($_POST['email']);
$department = trim($_POST['department']);
// ভ্যালিডেশন চেক করা
if (empty($name) || empty($email) || empty($department)) {
http_response_code(400); // Bad Request
echo "All fields are required.";
exit();
}
// ইমেইল ভ্যালিডেশন
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
http_response_code(400); // Bad Request
echo "Invalid email format.";
exit();
}
// ডাটাবেস কানেকশন সেটআপ
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "company_db";
$conn = new mysqli($servername, $username, $password, $dbname);
// কানেকশন চেক করা
if ($conn->connect_error) {
http_response_code(500); // Internal Server Error
error_log("Connection failed: " . $conn->connect_error);
echo "Database connection error. Please try again later.";
exit();
}
// SQL কুয়েরি তৈরি করা
$stmt = $conn->prepare("INSERT INTO employees (name, email, department) VALUES (?, ?, ?)");
if (!$stmt) {
http_response_code(500); // Internal Server Error
error_log("Statement preparation failed: " . $conn->error);
echo "Database error. Please try again later.";
exit();
}
$stmt->bind_param("sss", $name, $email, $department);
// ডেটা ইনসার্ট করার চেষ্টা করা এবং এরর হ্যান্ডলিং
if ($stmt->execute()) {
echo "Employee data submitted successfully!";
} else {
http_response_code(500); // Internal Server Error
error_log("Execution failed: " . $stmt->error);
echo "Error submitting data. Please try again.";
}
// কানেকশন এবং স্টেটমেন্ট বন্ধ করা
$stmt->close();
$conn->close();
?>
ডেটা সংগ্রহ এবং পরিষ্কার করা:
$_POST
দিয়ে ডেটা সংগ্রহ করা হয়েছে এবং trim()
ফাংশন দিয়ে ইনপুট ফিল্ডের শুরু এবং শেষের অপ্রয়োজনীয় স্পেস সরানো হয়েছে।ভ্যালিডেশন চেক করা:
empty()
) একটি ত্রুটি মেসেজ রিটার্ন করা হয়েছে এবং HTTP স্ট্যাটাস কোড 400
সেট করা হয়েছে, যা বোঝায় যে রিকোয়েস্ট সঠিক নয়।filter_var()
ফাংশন ব্যবহার করা হয়েছে। যদি ইমেইল ঠিক না হয়, তাহলে একটি ত্রুটি মেসেজ রিটার্ন করা হয়েছে এবং HTTP স্ট্যাটাস কোড 400
সেট করা হয়েছে।ডাটাবেস কানেকশন এবং ত্রুটি লগ করা:
http_response_code(500)
ব্যবহার করে সার্ভার সাইড ত্রুটি বোঝানো হয়েছে। error_log()
ব্যবহার করে ত্রুটি লগ করা হয়েছে এবং ব্যবহারকারীর জন্য একটি জেনেরিক মেসেজ দেখানো হয়েছে।SQL স্টেটমেন্ট তৈরি এবং ত্রুটি হ্যান্ডলিং:
prepare()
মেথড দিয়ে যদি এটি ব্যর্থ হয়, তাহলে সার্ভার সাইড ত্রুটি লগ এবং রেসপন্স দেওয়া হয়েছে।HTTP স্ট্যাটাস কোড ব্যবহারের মাধ্যমে ত্রুটি হ্যান্ডলিং:
400 Bad Request
এবং 500 Internal Server Error
স্ট্যাটাস কোড ব্যবহার করে ত্রুটি ম্যানেজমেন্ট করা হয়েছে, যাতে Ajax রিকোয়েস্ট সঠিকভাবে ত্রুটি শনাক্ত করতে পারে।এই উদাহরণটি অনুসরণ করে আপনি Ajax এবং PHP ব্যবহার করে Server Side Validation এবং Error Handling কার্যকরভাবে করতে পারবেন, যা আপনার ওয়েব অ্যাপ্লিকেশনকে আরও সুরক্ষিত ও রেসপন্সিভ করে তুলবে।